<template>
  <div>
    <div id="colorlib-page" v-for="(item, index) in essay" :key="index">
      <div class="work-single-flex js-fullheight">
        <div class="col-half js-full-height work-img">
          <img :src="item.l_img" alt />
        </div>
        <div class="col-half js-fullheight">
          <div class="display-t js-fullheight">
            <div class="display-tc js-fullheight">
              <div class="work-desc">
                <h2>{{item.l_title}}</h2>
                <p>{{item.l_content}}</p>
                <p>
                  <a href="/#/work" class="btn-preview">{{item.l_name}}</a>
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { work } from "../api/index.js";
export default {
  name: "work",
  data() {
    return {
	  lid: this.$route.params.id,
      work: [],
      list: [],
      essay: [],
      wid: '1',
    };
  },
  methods: {
    async postwork() {
      let wid = this.wid;
	  let lid = this.lid;
	  console.log(this.lid);
      var result = await work({ wid: wid, lid: lid });
      console.log(result);
      this.work = result["message"]["work"];
      this.list = result["message"]["list"];
      this.essay = result["message"]["essay"];
    },
    // async test() {
      
    // }
  },
  mounted() {
	this.postwork();
	// this.test();
  }
};
</script>